<template>
  <view>
    <!-- 通知栏 -->
    <van-notice-bar
      scrollable
      color="#1989fa"
      background="#ecf9ff"
      left-icon="bulb-o"
      mode="closeable"
      text="v1.0更新：增加了xxx功能"
    />
    <!-- 底部标签栏 -->
    <van-tabbar :active="active" @change="onChange">
      <van-tabbar-item icon="column">卡片</van-tabbar-item>
      <van-tabbar-item icon="friends">社区</van-tabbar-item>
      <van-tabbar-item icon="clock">统计</van-tabbar-item>
      <van-tabbar-item icon="user-o">个人中心</van-tabbar-item>
    </van-tabbar>
    <xiri-card></xiri-card>
  </view>
</template>   
<script>
import { XiriCard } from "./components/xiri-card.vue";
export default {
  data() {
    return {
      active: 0,
    };
  },
  methods: {
    onChange(e) {
      uni.navigateTo({
         url: 'test?id=1&name=uniapp'
      });
      this.active = e.detail; // 设置成对应的标签
    },
  },
  components: {
    XiriCard,
  },
};
</script> 
<style>
</style>